<?php
$featureName = '套餐';
$permission = 'combo';
?>
@extends('admin.tableLayout')
@section('title',$featureName.'列表')
@section('barName',$featureName.'列表')
@section('quote')
    <button type="button" class="layui-btn layui-btn-small" id="getAll" onclick="javascript:location.href='{{route($routePrefix.'.add')}}'"><i class="fa fa-plus" aria-hidden="true"></i> 添加{{$featureName}}</button>
    <hr/>
   <form class="layui-form" >
        <label>状态：</label>
        <div class="layui-inline">
            <select name="status"  id="status" lay-search lay-filter="select">
                <option value="">全部</option>
                @foreach($status as $k=>$v)
                    <option value="{{$k}}">{{$v}}</option>
                @endforeach
            </select>

        </div>
       <label>返利方式：</label>
       <div class="layui-inline">
           <select name="rate_types"  id="rate_type" lay-search lay-filter="select">
               <option value="">全部</option>
               @foreach($rate_types as $k=>$v)
                   <option value="{{$k}}">{{$v}}</option>
               @endforeach
           </select>

       </div>
        <div id="select" class="layui-inline"></div>

        <div class="layui-inline">
            <input type="text" class="layui-input" width="200px" id="datetime" name="searchTime" value="" placeholder="日期范围搜索">
        </div>
        <div class="layui-inline">
            <input type="text" name="searchKey" placeholder="{{$featureName}}名称" autocomplete="off" value="" class="layui-input">
        </div>
        <button lay-filter="search" class="layui-btn" id="search"><i class="fa fa-search" aria-hidden="true"></i> 查询</button>
    </form>
@endsection

@section('checkbox_btn')
    @can($permission)
    <button class="layui-btn" data-type="draftAll">批量禁用</button>
    <button class="layui-btn" data-type="publishedAll">批量启用</button>
    <button class="layui-btn" data-type="deleteAll">批量删除</button>
    @endcan
@endsection
@section('toolbar')
    @can($permission)
        <a class="layui-btn layui-btn-xs" lay-event="read">查看</a>

        <a class="layui-btn layui-btn-xs " lay-event="edit">编辑</a>
    @endcan
    @can($permission)
    @{{#  if(d.status == 1){ }}
    <a class="layui-btn layui-btn-xs" lay-event="draft">{{$manager->getStatusString(\App\Http\Controllers\Admin\Scene\Service\Spot::OFF)}}</a>
    @{{#  } else { }}
    <a class="layui-btn layui-btn-xs" lay-event="published">{{$manager->getStatusString(\App\Http\Controllers\Admin\Scene\Service\Spot::ON)}}</a>
    @{{#  } }}
@endcan
    @can($permission)
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
    @endcan
@endsection
@section('tableRender')
    <script type="text/html" id="rate_type_tpl">

        @{{#  if(d.rate_type == 1){ }}
        <span>
            @{{ d.rate_type_name }}
        </span>
        @{{#  } else { }}
        @{{ d.rate_type_name }}
        <a href="javascript:void(0)" class="rate_tips" rate="@{{ d.rate }}" toprate="@{{ d.top_rate }}" style="color:#3b97d7">
            查看详情
        </a>
        @{{#  } }}
    </script>
    <script>
        layui.use(['table','jquery','form'], function(){
            var table = layui.table;
            var $=layui.jquery;
            var form=layui.form;
            var category_id=$("#category_id").val();
            var _renderLoad = layer.msg('正在查找{{$featureName}}，请稍候',{icon: 16,time:false,shade:0.8});
            var render=table.render({
                elem:"#table",
                page:true,
                id:'idTest',
                url:'{{route($routePrefix.'.Ajax')}}',
                where:{
                    searchKey:$("input[name='searchKey']").val(),
                    searchTime:$("input[name='searchTime']").val(),
                    status:$("#status").val(),
                    rate_types:$("#rate_types").val()
                },
                height:400,
                cols:  [[ //标题栏
                    {checkbox:true,fixed:true},
                    {field:'sort',title:'排序<i class="fa fa-paint-brush"></i>',width:80,edit:'text',fixed:true},
                    {field: 'id', title: 'ID', width: 80,fixed:true}
                    ,{field: 'title', title: '{{$featureName}}名称', width: 150},
                    {field: 'status_name', title: '状态', width: 80},
                    {field: 'price', title: '价格(￥)', width: 80},
                    {field:'zhilv_price',title:'智旅价格(￥)',width:100},
                    {field:'times',title:'价值(次数)',width:100},
                    {field:'rate_type_name',title:'返利方式',width:200,templet:'#rate_type_tpl'},
                    {field: 'created_at', title: '创建时间', width: 150},
                    {field: 'updated_at', title: '修改时间', width: 150},
                    {fixed: 'right', width:350,title:'操作', align:'center', toolbar: '#toolbar'}
                    //这里的toolbar值是模板元素的选择器
                ]],
                response: {//返回格式自定义
                    statusName: 'code' //数据状态的字段名称，默认：code
                    ,statusCode: 0 //成功的状态码，默认：0
                    ,msgName: 'msg' //状态信息的字段名称，默认：msg
                    ,countName: 'total' //数据总数的字段名称，默认：count
                    ,dataName: 'data' //数据列表的字段名称，默认：data
                },
                done:function () {
                    layer.close(_renderLoad);
                }
            });
            $('#search').on('click',function () {
                var data = {
                    searchKey:$("input[name='searchKey']").val(),
                    searchTime:$("input[name='searchTime']").val(),
                    status:$("#status").val(),
                    rate_types:$("#rate_types").val()
                };
                _renderLoad = layer.msg('正在查找{{$featureName}}，请稍候',{icon: 16,time:false,shade:0.8});
                render.reload(
                    {
                        where:data
                    }
                );
                return false;
            })
            table.on('checkbox(table)', function(obj){
                //console.log(obj)
            });
            $(document).on('click','.rate_tips',function () {
                var that = this;
                var rate = $(this).attr('rate');
                var top_rate =$(this).attr('toprate');
                layer.tips('上级比率：'+rate+'%<br/>顶级比率：'+top_rate+'%', that); //在元素的事件回调体中，follow直接赋予this即可
            })

            //上方
            var   active = {
                deleteAll: function(){ //获取选中数据
                    var checkStatus = table.checkStatus('idTest')
                        ,data = checkStatus.data;
                    var str=[];
                    if(data==''){
                        layer.msg('请选中所删除的行',{icon:5})
                        return false;
                    }
                    for(var i=0;i<data.length;i++){
                        str.push(data[i].id);
                    }

                    layer.confirm('是否删除所选',function(index) {

                        $.get('{{route($routePrefix,['act'=>'delete'])}}', {id: str,type:1}, function (obj) {
                            if (obj.info == 'success') {
                                layer.msg('操作成功', {icon: 1});
                                render.reload();
                            } else {
                                layer.msg('网络繁忙', {icon: 5});
                            }

                        })
                    })

                },
                draftAll: function(){ //获取选中数目
                    var checkStatus = table.checkStatus('idTest')
                        ,data = checkStatus.data;
                    var str=[];
                    if(data==''){
                        layer.msg('请选中所要禁用的记录',{icon:5})
                        return false;
                    }
                    for(var i=0;i<data.length;i++){
                        str.push(data[i].id);
                    }
                    layer.confirm('是否将选中的禁用',function(index){
                        layer.close(index);
                        //服务端发送审核指令
                        $.get('{{route($routePrefix,['act'=>'draft'])}}',{id:str,type:1},function(obj){
                            if(obj.info=='success'){
                                layer.msg('操作成功',{icon:1});
                                render.reload();
                            }else{
                                layer.msg('网络繁忙',{icon:5});
                            }

                        })
                    });

                }
                ,
                publishedAll: function(){ //获取选中数目

                    var checkStatus = table.checkStatus('idTest')
                        ,data = checkStatus.data;
                    var str=[];
                    if(data==''){
                        layer.msg('请选中所启用的记录',{icon:5})
                        return false;
                    }
                    for(var i=0;i<data.length;i++){
                        str.push(data[i].id);
                    }
                    layer.confirm('是否启用选中记录',function(index){
                        layer.close(index);
                        //服务端发送审核指令
                        $.get('{{route($routePrefix,['act'=>'published'])}}',{id:str,type:1},function(obj){
                            if(obj.info=='success'){
                                layer.msg('操作成功',{icon:1});
                                render.reload();
                            }else{
                                layer.msg('网络繁忙',{icon:5});
                            }

                        })
                    });

                },isAll: function(){ //验证是否全选
                    var checkStatus = table.checkStatus('idTest');
                    layer.msg(checkStatus.isAll ? '全选': '未全选')
                }
            };
            $('.demoTable .layui-btn').on('click', function(){
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
            table.on('edit(table)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
                $.get('{{route($routePrefix,['act'=>'sortCol'])}}',{id:obj.data.id,sort:obj.value},function (e) {
                },'json')
            });
            table.on('tool(table)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值
                var tr = obj.tr; //获得当前行 tr 的DOM对象
                 if(layEvent === 'delete'){ //删除
                    layer.confirm('真的删除行么', function(index){
                        layer.close(index);
                        //向服务端发送删除指令
                        $.get('{{route($routePrefix,['act'=>'delete'])}}',{id:data.id},function(e){
                            if(e.info=='success'){
                                layer.msg('操作成功',{icon:1});
                                obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            }
                        });
                    });
                } else if(layEvent === 'edit'){ //编辑
                     location.href='/admin/business/combo/edit/'+data.id;
                    //do something
                    //同步更新缓存对应的值
                }else if(layEvent === 'draft'){
                    layer.confirm('是否禁用',function(index){
                        layer.close(index);
                        //服务端发送审核指令
                        $.get('{{route($routePrefix,['act'=>'draft'])}}',{id:data.id},function(e){
                            if(e.info=='success'){
                                layer.msg('操作成功',{icon:1});
                                render.reload();
                            }else{
                                layer.msg('网络繁忙',{icon:5});
                            }

                        })
                    });

                }else if(layEvent=='published'){
                    layer.confirm('是否启用',function(index){
                        layer.close(index);
                        //服务端发送审核指令
                        $.get('{{route($routePrefix,['act'=>'published'])}}',{id:data.id},function(e){
                            if(e.info=='success'){
                                layer.msg('操作成功',{icon:1});
                                render.reload();
                            }else{
                                layer.msg('网络繁忙',{icon:5});
                            }

                        })
                    });
                }else if(layEvent=='read'){

                     $(window).one("resize",function(){
                         var _url = '/admin/business/combo/read/'+data.id;
                         var index = layui.layer.open({
                             title : "查看详情",
                             type : 2,
                             content : _url,
                             success : function(layero, index){
                                 setTimeout(function(){
                                     layui.layer.tips('点击此处返回列表', '.layui-layer-setwin .layui-layer-close', {
                                         tips: 3
                                     });
                                 },500)
                             }
                         })
                         layui.layer.full(index);
                     }).resize();
                 }
            });
        });
    </script>
@endsection

